<template>
    <a-card :bordered="false">
        <div class="table-page-search-wrapper">
            <a-form layout="inline">
                <a-row :gutter="10">
                    <a-col :md="4" :sm="24">
                        <a-form-item>
                            <a-range-picker @change="onAllocateTimeChange" :value="time" />
                        </a-form-item>
                    </a-col>
                    <a-col :md="6" :sm="24">
                        <a-button type="primary" @click="() => {
                                this.pagination.current = 1
                                this.getDataList()
                            }
                            ">查询
                        </a-button>
                        <a-button style="margin-left: 8px" @click="repossess">重置</a-button>
                    </a-col>
                </a-row>
            </a-form>
        </div>

        <a-table ref="table" :scroll="{ y: 530 }" :columns="columns" :rowKey="(row, index) => index" :dataSource="data"
            :pagination="pagination" :loading="loading" @change="handleTableChange"
            :rowSelection="{ selectedRowKeys: selectedRowKeys, onChange: onSelectChange }" :bordered="true" size="small">
            <span slot="dDate" slot-scope="dDate">{{ timeFormat(dDate) }}</span>
            <span slot="action" slot-scope="text, record">
                <template>
                    <a @click="handleEdit(record.SBVID)">查看</a>
                    <!-- <a-divider v-if="hasPerm('SaleBillVouch.Edit') && hasPerm('SaleBillVouch.Delete')" type="vertical" />
          <a v-if="hasPerm('SaleBillVouch.Delete')" @click="handleDelete([record.Id])">删除</a> -->
                </template>
            </span>
        </a-table>
        <edit-form ref="editForm" :parentObj="this"></edit-form>
    </a-card>
</template>

<script>
import moment from 'moment'
import EditForm from '../../OrderManagement/SaleBillVouch/EditForm'

const columns = [
    // { title: '销售发票主表标识', dataIndex: 'SBVID', width: '10%' },
    { title: '销售发票号', dataIndex: 'cSBVCode' },
    { title: '客户名称', dataIndex: 'cCusName', width: '15%' },
    { title: '客户编码', dataIndex: 'cCusCode' },
    { title: '单据日期', dataIndex: 'dDate', align: 'center', scopedSlots: { customRender: 'dDate' } },
    // { title: '发票类型', dataIndex: 'cVouchType' },
    { title: '发票类型', dataIndex: 'cVouchName' },
    // { title: '销售类型', dataIndex: 'cSTCode' },
    { title: '销售类型', dataIndex: 'cSTName' },
    // { title: '发运方式', dataIndex: 'cSCCode'   // { title: '币种名称', dataIndex: 'cexch_name' },
    // { title: '汇率', dataIndex: 'iExchRate', width: '50px' },},
    { title: '发货地址', dataIndex: 'cShipAddress', width: '25%', ellipsis: true },
    { title: '操作', dataIndex: 'action', align: 'left', scopedSlots: { customRender: 'action' } }
]

export default {
    props: {
        cCusCode: { require: true, type: String }
    },
    components: {
        EditForm,
    },
    mounted() {
        this.queryParam = {}
        this.time = null
        this.getDataList()
    },
    data() {
        return {
            data: [],
            time: null,
            pagination: {
                current: 1,
                pageSize: 25,
                showTotal: (total, range) => `总数:${total} 当前:${range[0]}-${range[1]}`,
                pageSizeOptions: ['25', '50', '100'], // 设置pageSize的可选值，页面可以通过下拉框进行选择
                showSizeChanger: true
            },
            filters: {},
            sorter: { field: 'Id', order: 'desc' },
            loading: false,
            columns,
            queryParam: {},
            selectedRowKeys: []
        }
    },
    methods: {
        onAllocateTimeChange(dates, dateStrings) {
            this.queryParam.sDate = dateStrings[0]
            this.queryParam.dDate = dateStrings[1]

            this.time = dates
        },
        repossess() {
            this.queryParam = {}
            this.time = null
            this.getDataList()
        },
        handleTableChange(pagination, filters, sorter) {
            this.pagination = { ...pagination }
            this.filters = { ...filters }

            this.getDataList()
        },
        getDataList() {
            this.selectedRowKeys = []

            this.loading = true
            this.$http
                .post('/OrderManagement/SaleBillVouch/GetDataListByCustAndDate', {
                    PageIndex: this.pagination.current,
                    PageRows: this.pagination.pageSize,
                    SortField: this.sorter.field || 'Id',
                    SortType: this.sorter.order, DeptId: this.DeptId,
                    Search: {
                        CustomerId: this.cCusCode,
                        sDate: this.queryParam.sDate,
                        dDate: this.queryParam.dDate
                    },
                    ...this.filters
                })
                .then(resJson => {
                    this.loading = false
                    this.data = resJson.Data
                    if (this.data) {
                        const pagination = { ...this.pagination }
                        pagination.total = resJson.Total
                        this.pagination = pagination
                    }
                })
        },
        onSelectChange(selectedRowKeys) {
            this.selectedRowKeys = selectedRowKeys
        },
        hasSelected() {
            return this.selectedRowKeys.length > 0
        },
        handleAdd() {
            this.$refs.editForm.openForm(null, '新建销售发票主表信息')
        },
        handleEdit(id) {
            this.$refs.editForm.openForm(id, '详情')
        },
        handleDelete(ids) {
            var thisObj = this
            this.$confirm('确认删除吗?', '提示', {
                confirmButtonText: '确定',
                cancelButtonText: '取消',
                type: 'warning'
            }).then(() => {
                return new Promise((resolve, reject) => {
                    thisObj.$http.post('/OrderManagement/SaleBillVouch/DeleteData', ids).then(resJson => {
                        resolve()

                        if (resJson.Success) {
                            thisObj.$message.success('操作成功!')

                            thisObj.getDataList()
                        } else {
                            thisObj.$message.error(resJson.Msg)
                        }
                    })
                })
            })
        },
        timeFormat(val) {
            // 时间格式化函数
            return moment(val).format('YYYY-MM-DD HH:mm')
        }
    }
}
</script>
